<template>
	<view>
		<uni-popup ref="remindDialog" background-color="#fff" style="position: relative;" :is-mask-click="false">
			<view class="popup-content">
				<!-- 头部标题显示 -->
				<view class="header-title">
					<i class="iconfont titleIcon" v-if="type == 0 " style="color: #00a660;">&#xe69e;</i>
					<i class="iconfont titleIcon" v-else>&#xe6d1;</i>
					<span style="font-size: 32rpx;" :style="type==0?'color:#00a660':'color:orange;'">{{ title }}</span>
				</view>
				<i class="iconfont delIcon" @click="close">&#xe903;</i>

				<view class="list-item">
					<view>
						<i class="iconfont gantan">&#xe70f;</i>
						<span v-if="companyId != 0">感谢您使用【励氪签】全证据链电子签约平台，系统已自动赠送您【{{remainingNum}}次】合同签署量，欢迎使用！</span>
						<span v-else>感谢您使用【励氪签】全证据链电子签约平台，系统已自动赠送您【{{remainingNum}}次】合同签署量，欢迎使用！</span>
					</view>
					<button size="mini" disabled class="right_btn">已领取</button>
				</view>

				<view class="list-item" v-if="companyId != 0">
					<view>
						<i class="iconfont gantan">&#xe70f;</i>
						<span>系统已自动为您单位创建【电子公章】，如需添加更多印章，请进入【我的>>印章管理】设置。</span>
						<!-- <uni-tooltip content="如：合同专用章、财务专用章、人事专用章，法定代表人私章、单位负责人私章、外资企业印章等。">
							<i class="iconfont wenhao">&#xe617;</i> 
						</uni-tooltip> -->
					</view>
					<button size="mini" disabled class="right_btn">已领取</button>
				</view>

				<view class="list-item" v-else>
					<view>
						<i class="iconfont gantan">&#xe70f;</i>
						<span>系统已自动为您创建【标准签字章】，如需添加手写签字章，请进入【我的>>个人中心>>个人印章】设置。</span>
						<!-- <uni-tooltip content="标准签字章与手写签字章具有同等法律效力">
							<i class="iconfont wenhao">&#xe617;</i>
						</uni-tooltip> -->
					</view>
					<button size="mini" disabled class="right_btn">已领取</button>
				</view>

				<view class="list-item">
					<view>
						<i class="iconfont gantan">&#xe70f;</i>
						<span>您已通过验证并登录系统，为方便您后期快速登录，请您设置【登录密码】。</span>
						<!-- <uni-tooltip content="您可通过帐号、密码方式快速登录系统。">
							<i class="iconfont wenhao">&#xe617;</i>
						</uni-tooltip> -->
					</view>
					<button size="mini" class="right_btn" v-if="! this.$store.getters.staffInfo.password" @click="loginCode">立即设置</button>
					<button size="mini" class="right_btn" disabled v-if="!! this.$store.getters.staffInfo.password">已设置</button>
				</view>

				<view class="list-item">
					<view>
						<i class="iconfont gantan">&#xe70f;</i>
						<span>为方便您【签署合同】或通过【支付密码】购买产品及服务，请您设置【签署密码 / 支付密码】。</span>
						<!-- <uni-tooltip
							content="签署密码与支付密码一样，属于二次验证密码，安全级别较高，请您妥善保管，请勿泄露他人。为保障您的真实签署意愿，您签署合同时，可输入【签署密码】来确认文件签署。通过账户余额购买、账户碳能量兑换签署套餐、出证服务、范本服务时，需要使用支付密码来确认您的购买意愿。">
							<i class="iconfont wenhao">&#xe617;</i>
						</uni-tooltip> -->
					</view>
					<button size="mini" class="right_btn" v-if="! this.$store.getters.staffInfo.payPassword" @click="signCode">立即设置</button>
					<button size="mini" class="right_btn" disabled v-if="!! this.$store.getters.staffInfo.payPassword">已设置</button>
				</view>


			</view>
		</uni-popup>
	</view>
</template>

<script>
	import {getRemainingNum} from "../../api/staff";
    export default {
		data() {
			return {
				msgType: 'info',
				title: '',
				type: "", //0实名认证后跳转首页显示，1有签署任务显示
				companyId: this.$store.getters.staffInfo.companyId,
                remainingNum: 0, //签署量
			}
		},
		onLoad() {

		},
		methods: {
			close(){
				this.$refs.remindDialog.close()
			},
            /** 获取剩余签署量 */
            getRemainingNum() {
              getRemainingNum({staffId:this.$store.getters.staffInfo.id,companyId:this.$store.getters.staffInfo.companyId}).then((response)=>{
                this.remainingNum = response.data;
              });
            },
			// 签署，支付密码设置
			signCode(){
				this.close()
				uni.navigateTo({
					url:'/pages/mine/personal/personalCenter/userInfo'
				})
			},
			// 登录密码设置
			loginCode(){
				this.close()
				uni.navigateTo({
					url:'/pages/mine/personal/personalCenter/userInfo'
				})
			},
      // 传参 0 实名认证消息  1未完成的任务
			openDialog(type) {
				this.type = type;
				// 判断是否认证
				if ((this.$store.getters.staffInfo.companyId == 0 && this.$store.getters.staffInfo.isCertify == 1) ||
					(this.$store.getters.staffInfo.companyId != 0 && this.$store.getters.companyInfo.isCertify == 1)) {
					this.$refs.remindDialog.open('center')
					if (type == 0) {
						if (this.$store.getters.staffInfo.companyId != 0) {
							this.title = "恭喜，您已完成企业实名认证！";
						} else {
							this.title = "恭喜，您已完成个人实名认证！";
						}
					} else {
						this.title = "温馨提示：您有未完成任务";
					}
					// 获取赠送的签署量
					this.getRemainingNum();
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.delIcon{
		position: absolute;
		top: 14rpx;
		right: 14rpx;
		color: #999;
		font-size: 32rpx;
	}
	::v-deep .uni-tooltip-popup {
		width: 320rpx;
	}
	::v-deep uni-button[disabled]:not([type]){
		color: #777;
		background-color: #dcdcdc;
	}

	.uni-tooltip {
		display: inline-block;
	}

	.right_btn {
		background: $uni-color-primary;
		color: #fff ;
		width: 180rpx;
		text-align: center;
		margin-top: 10rpx;
	}

	.list-item {
		background: #f5f6f7;
		padding: 26rpx 26rpx 20rpx 26rpx;
		border-radius: 6rpx;
		color: #555;
		margin: 26rpx 18rpx;
		text-align: right;
        font-size: 26rpx;
		view {
			text-align: left;
		}

		.gantan {
			color: #666;
			margin-right: 8rpx;
			font-size: 24rpx;
		}

		.wenhao {
			font-size: 24rpx;
			color: #666;
		}
	}

	.popup-content {
		padding: 40rpx 20rpx;
	}

	.header-title {
		text-align: center;
	}

	.titleIcon {
		color: orange;
		margin-right: 8rpx;
		font-size: 30rpx;
	}

	::v-deep .uni-popup .uni-popup__wrapper {
		width: 90%;
	}
</style>